.sidenav{background:#fff;box-shadow:2px 2px 6px rgba(0,0,0,.3);display:none;font-size:16px;font-weight:400;height:100%;left:0;position:fixed;overflow:auto;transform:translate(-262px,0);transition:transform .3s;top:0;width:256px;z-index:9999}
.sidenav.show{transform:translate(0,0)}
.sidenav-brand{background:#333;border-bottom:1px solid #666;color:#fff;font-size:24px;font-weight:700;line-height:32px;padding:20px 24px 19px}
.sidenav-dropdown,.sidenav-header{border-bottom:1px solid #999;margin:0}
.sidenav-header{background:0 0;color:#757575;font-size:19.2px;line-height:32px;padding:16px 24px 15px}
.sidenav-header small{display:block;font-size:14.4px;line-height:16px}
.sidenav-menu{list-style:none;margin:0;padding:0}
.sidenav-menu li{display:block;position:relative;border-bottom:1px solid #efefef}
.sidenav-menu a{background:0 0;color:#94a0a8;display:block;line-height:24px;padding:16px 32px;text-decoration:none;font-size:16px;}

.sidenav-menu a.active,.sidenav-menu a.active .sidenav-dropdown-icon,.sidenav-menu a.active .sidenav-link-icon{color:#FAFAFA}
.sidenav-dropdown-icon,.sidenav-link-icon{color:#757575;position:absolute;text-align:center;top:16px}
.sidenav-link-icon{display:block;height:24px;left:24px;width:24px}
.sidenav-link-icon i {font-size:24px}
.sidenav-link-title{display:block;padding:0 16px 0 40px}
.sidenav-dropdown{display:none;list-style:none;padding:0}
.sidenav-dropdown a{background:#eaeaea;color:#333;padding-left:72px}
.sidenav-dropdown a:hover{background:#616161}
.sidenav-dropdown li {border-bottom:1px solid #ddd}
.sidenav-dropdown li:first-child a{box-shadow:inset 0 1px 1px rgba(0,0,0,.1)}
.sidenav-dropdown-icon{display:none;height:16px;right:16px;width:16px}
.sidenav-dropdown-icon.show{display:block}
.sidenav-overlay{background:#000;opacity:0.5;display:none;height:100%;left:0;position:fixed;top:0;width:100%;z-index:9998;overflow:hidden}
.sidenav-no-scroll{overflow:hidden!important}

.typenav{background:#3488EA;box-shadow:2px 2px 6px rgba(0,0,0,.3);display:none;font-size:16px;font-weight:400;height:100%;right:0;position:fixed;overflow:auto;transform:translate(262px,0);transition:transform .3s;top:0;width:256px;z-index:9990}
.typenav.show{transform:translate(0,0)}

.typenav .sidenav-brand {background:#3071BD;border:0;padding:10px;font-size:18px}
.typenav ul li {float:left;width:50%;padding:0 10px;box-sizing:border-box;margin-top:10px}
.typenav ul li a {display:block;line-height:30px; background:#4b93e9; border-radius:2px; padding:0 5px;color:#fff}
@media screen and (max-width:960px){
.sidenav,.typenav {display:block}
}